<template>
  <div class="">
    <div class="admin-head">
      <span class="iconfont icon-laout layut" @click="layutLogin"></span>
      <div style="padding-top: .5rem;">本月收入</div>
      <div class="admin-month">{{monthAmount}}</div>
      <div class="admin-tot">总收入 ¥{{amount}}</div>
    </div>
    <div class="admin-timechose">
      <div class="admin-time"><input type="month" name="" id="myMonth" v-model="dateStr" ><span class="iconfont icon-down down"></span></div>
    </div>
    <div class="p_Blankpages" v-if="list.length <= 0" >
        <div class="p_Blankpages2" style="display:block">
            <div class="p_blank_ico">
              <img src="https://jzcdn.jzdoctor.com/notdata.png" style="width:30%;margin:0 auto">
            </div>
            <div class="p_blank_hist">暂无订单信息</div>
        </div>
    </div>
    <!-- <div v-else v-scroll="getMore"> -->
    <div v-else >
      <ul class="admin-listall" >
        <li v-for="(item, index) in list">
          <div class="admin-litot">
            <div>{{item.day}}</div>
            <div class="tot">总计：{{item.dayAmount}}</div>
          </div>
          <div class="admin-list" v-if="item.records.length > 0" >
            <div class="admin-each" v-for="(v, li) in item.records">
              <div class="head"><img :src="v.headImg"></div>
              <div class="admin-base">
                <div class="userinfo">
                  <div>{{v.nickname}}</div>
                  <div class="price">+{{v.payAmount}}</div>
                </div>
                <div class="shopinfo">
                  <div>{{v.trademarkName}} {{v.shopName}}</div>
                  <!-- <div>{{v.shopName}}</div> -->
                  <div class="payway">{{v.payType}}</div>
                </div>
                <div class="orderinfo">
                  <div>订单号：{{v.orderNo}}</div>
                  <div class="flex time">{{v.createDate}}</div>
                </div>
              </div>
            </div>
          </div>
        </li>
      </ul>
    </div>

  </div>
</template>
<script>
  import Vue from 'vue'
  // import Lockr from 'lockr'
  export default {
    name: 'chosepay',
    data () {
      return {
        list: [],
        dateStr: '',
        monthAmount: 0,
        amount: 0,
        isactive: false,
        isfined: false,
        pageindex: 1
      }
    },
    mounted: function () {
      if (!localStorage.shopids || localStorage.shopids === undefined) {
        Vue.prototype.$tools.loading(false)
        let _this = this
        this.$layer.toast({
          icon: 'icon-check', // 图标clssName 如果为空 toast位置位于下方,否则居中
          content: '请先登录！',
          time: 1000 // 自动消失时间 toast类型默认消失时间为2000毫秒
        })
        setTimeout(function () {
          _this.$router.replace({name: 'Login'})
        }, 1000)
      }
      // if (!Lockr.get('shopids')) {
      //   Vue.prototype.$tools.loading(false)
      //   let _this = this
      //   this.$layer.toast({
      //     icon: 'icon-check', // 图标clssName 如果为空 toast位置位于下方,否则居中
      //     content: '请先登录！',
      //     time: 1200 // 自动消失时间 toast类型默认消失时间为2000毫秒
      //   })
      //   setInterval(function () {
      //     _this.$router.replace({name: 'Login'})
      //   }, 1200)
      //   // this.$router.replace({name: 'Login'})
      // }
      this.init()
    },
    // created: function () {
    // },
    watch: {
      dateStr () {
        this.list = []
        this.isactive = false
        this.isfined = false
        this.pageindex = 1
        // if (Lockr.get('shopids')) {
        if (localStorage.shopids) {
          this.getList()
        }
      }
    },
    methods: {
      init: function () {
        this.dateStr = this.getNowFormatDate()
        document.getElementById('myMonth').value = this.dateStr
        // this.getList()
      },
      getList: function () {
        let _this = this
        if (this.isactive || this.isfined) {
          return false
        }
        this.isactive = true
        let shopids = JSON.parse(localStorage.shopids)
        let v = {
          dateStr: this.dateStr,
          mobile: shopids.mobile,
          index: _this.pageindex,
          // pageSize: 8
          pageSize: 0
        }
        let str = ''
        // shopids.shopIds.forEach(function (v, k) {
        //   str += 'shopIds=' + v + '&'
        // })
        // str = str.slice(0, -1)
        str = str + 'dateStr=' + v.dateStr + '&mobile=' + v.mobile + '&index=' + v.index + '&pageSize=' + v.pageSize
        // console.log(str)
        // console.log(v.join(','))
        this.$EcHttpUtils.get('open/orderList.json?' + str).then(function (ret) {
          _this.isactive = false
          if (ret.data.statusCode === 0) {
            let rets = ret.data.data
            let list = rets.pageData.records
            _this.monthAmount = rets.monthAmount ? rets.monthAmount : 0
            _this.amount = rets.amount ? rets.amount : 0
            if (list.length <= 0) {
              _this.isshow = true
              _this.isfined = true
              return false
            }
            if (ret.data.data.totalCount <= 8) {
              _this.isfined = true
            }
            _this.list = _this.list.concat(list)
            _this.pageindex++
          }
        })
      },
      layutLogin: function () {
        let _this = this
        this.$layer.dialog({
          content: '是否确定退出登录？',
          contentClass: 'className',
          btn: ['确定', '取消']
        }).then(function (res) {
          if (res === 0) {
            localStorage.removeItem('shopids')
            // alert(localStorage.shopids)
            _this.$layer.toast({
              icon: 'icon-check',
              content: '退出成功！',
              time: 1000
            })
            setTimeout(function () {
              _this.$router.replace({name: 'Login'})
            }, 1000)
          }
        })
      },
      getNowFormatDate: function () {
        var date = new Date()
        var seperator1 = '-'
        var year = date.getFullYear()
        var month = date.getMonth() + 1
        // var strDate = date.getDate()
        if (month >= 1 && month <= 9) {
          month = '0' + month
        }
        // if (strDate >= 0 && strDate <= 9) {
        //   strDate = '0' + strDate
        // }
        var currentdate = year + seperator1 + month
        return currentdate
      },
      getMore: function () {
        this.getList()
      }
    },
    directives: {
      scroll: {
        bind: function (el, binding) {
          window.addEventListener('scroll', (e) => {
            if ((document.body.scrollTop || document.documentElement.scrollTop) + window.innerHeight >= el.clientHeight) {
              let getMore = binding.value
              getMore()
            }
          })
        }
      }
    }
  }
</script>
<style>
</style>
